<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        /*选择器*/
        /*标签选择器 */
        img{
            width: 50px;border-radius: 10px
        }

        /*class选择器 .className */
        .image{
            width: 100px;border-radius: 10px
        }

        /*id选择器  #idName */

        /*优先级 style内联>id> class> 标签*/
        .listStyle1{
            list-style-type: none;
            list-style-position: inside;
        }

        a{
            text-decoration: none; /*去掉下划线*/
            /*color: gray;如果使用color设置超链颜色，则未激活、鼠标点下去、激活后颜色都是同一
            个颜色 */
        }
        /* a:link 超链接初始状态(未激活) */
        a:link{
            color: darkcyan;
        }
        /* a:hover 设置鼠标悬停的样式 */
        a:hover{
            color:blue
        }
        /* a:active 设置超链接鼠标点击下去时的样式*/
        a:active{
            color: orange;
        }
        /* a:visited 设置激活后的超链接的样式 */
        a:visited{
            color:gray
        }


        .btnStyle{
            border: #008B8B 1px solid;
            border-radius: 3px;
            width: 180px;
            height: 30px;
            color: #008B8B;
        }
        .btnStyle:hover{
            background: #008B8B;
            color: white;
        }
    </style>

    <!--引入css文件-->
    <link rel="stylesheet" href="css.css">
</head>
<body style="background-repeat: no-repeat;background-size: cover">
<input type="text" style="width: 100px;height: 20px">
<img class="image" src="../static/honghuhuxinting.jpg" alt="" >
<img class="image" src="../static/honghuhuxinting.jpg" alt="" >
<img id="img1"class="image"  src="../static/honghuhuxinting.jpg" alt="" >

<button style="width: 80px;height: 50px;;margin: 20px 10px;
padding: 5px 2px">确认</button>

<!--字体-->
<div style="text-align: center;text-decoration: line-through;text-shadow: red 10px 3px 1px">
    <label style="font-size: 20px;font-weight: bold;color: aqua;font-family:'楷体';
">字体</label>
</div>

<ul class="listStyle1">
    <li>苹果</li>
    <li>梨子</li>
    <li>香蕉</li>
    <li>西瓜</li>
</ul>
<a href="table.html">百度</a>

<button class="btnStyle">测试按钮</button>
</body>
</html>